// 负责管理所有的自定义指令
// 首先定义一个自定义指令 v-imagerror

import { imgHandle } from "@/filters"

export const imagerror = {
  // 指定对象 会在当前的dom 元素插入到节点之后执行
  inserted(dom, options) {
    // options 是 指令中的变量的解释 
    // options 中 有一个 value 属性
    // dom 表示当前指令作用的dom对象
    // dom 认为此时就是图片
    // 初始化的时候 如果有值 就赋值 没值 就进入默认赋值
    dom.src = dom.src || options.value
    // 当图片有地址  但是地址没有加载成功的时候 会报错 会粗放图片的一个事件 => noerroe
    dom.onerror = function() {
      // dom 可以注册 error事件
      // dom.src = '默认图片' // 这里不能写死
      // 当图片出现异常的时候， 会将指令配置的默认图片设置为该图片的内容
      dom.src = options.value 
    }
  },
  componentUpload(dom, options) {
    // 这个钩子函数会在当前指令作用的组件 更新数据完毕之后 执行
    dom.src = dom.src || options.value
  }
}

// <img v-imagerror= "默认图片变量">
// data （） {   return  {   img：’a.png‘}}

